/**
 * This example demonstrates the Toolbar's two different modes of handling overflow:
 *
 * - "menu": buttons that don't fit on the toolbar are rendered into an overflow menu
 * - "scroller": scroller buttons are rendered on either side of the toolbar for scrolling
 * overflowing items into view.
 */
Ext.define('DragonApp.view.property.SelectBar', {
    extend: 'Ext.toolbar.Toolbar',
    xtype: 'property-select-bar',

    requires: [
        'DragonApp.view.property.ConsumablesGrid',
        'DragonApp.view.property.MonetaryGrid',
        'DragonApp.view.property.MonsterGrid',
        'DragonApp.view.property.OtherspropsGrid',
        'DragonApp.view.property.WeaponGrid',
        'DragonApp.view.property.RuneGrid'
    ],

    defaultListenerScope: true,

    items: [{
        xtype: 'button',
        text: '道具类型',
        tooltip: '提示：点击下拉菜单切换道具类型，之后通过添加按钮选择具体道具。',
        iconCls: 'x-fa fa-th',
        width: 120,
        menu: {
            items: [{
                text: '货币',
                checked: true,
                group: 'propType',
                handler: 'onItemCheck'
            }, {
                text: '装备',
                checked: false,
                group: 'propType',
                handler: 'onItemCheck'
            }, {
                text: '符文',
                checked: false,
                group: 'propType',
                handler: 'onItemCheck'
            }, {
                text: '消耗品',
                checked: false,
                group: 'propType',
                handler: 'onItemCheck'
            }, {
                text: '其它道具',
                checked: false,
                group: 'propType',
                handler: 'onItemCheck'
            }, {
                text: '佣兵',
                checked: false,
                group: 'propType',
                handler: 'onItemCheck'
            }]
        }
    }],

    onItemCheck: function(item) {

        var iText = item.text;

        var container = Ext.ComponentQuery.query('#property_select_container')[0];
        container.removeAll();

        switch (iText) {
            case '货币':
                var monetary = Ext.create('DragonApp.view.property.MonetaryGrid', {});
                container.add(monetary);
                break;
            case '装备':
                var weapon = Ext.create('DragonApp.view.property.WeaponGrid', {});
                container.add(weapon);
                break;
            case '符文':
                var rune = Ext.create('DragonApp.view.property.RuneGrid', {});
                container.add(rune);
                break;
            case '消耗品':
                var consumables = Ext.create('DragonApp.view.property.ConsumablesGrid', {});
                container.add(consumables);
                break;
            case '其它道具':
                var othersprops = Ext.create('DragonApp.view.property.OtherspropsGrid', {});
                container.add(othersprops);
                break;
            case '佣兵':
                var monster = Ext.create('DragonApp.view.property.MonsterGrid', {});
                container.add(monster);
                break;
            default:
                var monetary = Ext.create('DragonApp.view.property.MonetaryGrid', {});
                container.add(monetary);
        }
    }
});